<style lang="less">
    @import "drawerParty.less";
    .s1{
        .ivu-select-dropdown-list {
            height:200px
        }
    }

</style>
<template>
    <div class="search">
        <Row>
            <Col>
                <Card>
                    <Row>
                        <Form ref="searchForm" :model="searchForm" inline :label-width="90" class="search-form">


                            <Row>
                                <Form-item label="开票方名称" prop="drawerPartyName" style="width: 350px">
                                    <Input type="text" v-model.trim="searchForm.drawerPartyName" clearable placeholder="请输入"
                                           style="width: 200px;"/>
                                </Form-item>

                                <Form-item label="纳税人识别号" prop="taxpayerIdNumber" style="width: 350px">
                                    <Input type="text" v-model.trim="searchForm.taxpayerIdNumber" clearable placeholder="请输入"
                                           style="width: 200px"/>
                                </Form-item>

                                <Form-item label="状态" prop="status" style="width: 350px">
                                    <Select v-model="searchForm.status " clearable placeholder="请选择" style="width: 200px">
                                        <Option value="00">启用</Option>
                                        <Option value="02">草稿</Option>
                                        <Option value="05" >停用</Option>
                                    </Select>

                                    <a class="drop-down" @click="dropDown" > {{dropDownContent}}
                                        <Icon :type="dropDownIcon"></Icon>
                                    </a>
                                </Form-item>
                            </Row>
                            <Row>
                                <span v-if="drop">
                                <Form-item label="车商名称" prop="cardealerId" style="text-align: left;width: 350px" >
                                    <Select v-model="searchForm.cardealerId" clearable filterable placeholder="请选择" style="width: 200px" class="s1">
                                        <Option v-for="(item,index) in data2" :value="item.cardealerId" :label="item.cardealerName"  :key="index"></Option>
                                    </Select>
                                </Form-item>
                                <Form-item label="SP名称" prop="channelFullName" style="width: 350px">
                                    <Input type="text" v-model.trim="searchForm.channelFullName" clearable placeholder="请输入"
                                           style="width: 200px"/>
                                </Form-item>
                            </span>
                            </Row>
                        </Form>
                        <Form :label-width="490">
                            <Form-item style="margin-left:-35px;" class="br">
                                <Button @click="handleSearch" type="primary" icon="ios-search">查询</Button>
                                <Button @click="handleReset" icon="md-redo">重置</Button>
                            </Form-item>

                        </Form>
                    </Row>
                    <Row class="operation">
                        <Button @click="addDrawerParty" type="primary" icon="md-add" v-bind:disabled="!directManageRole && !commonManageRole">新增</Button>
                        <Button @click="disable" icon="md-remove-circle" type="error" v-bind:disabled="!directManageRole && !commonManageRole">停用</Button>
                        <circleLoading v-if="operationLoading"/>
                    </Row>

                    <Row>
                        <Table :loading="loading" border :columns="columns" :data="data" sortable="custom"
                               @on-sort-change="changeSort" @on-selection-change="showSelect" ref="table">

                            <template slot-scope="{ row, index }" slot="drawerPartyName" >
                                <a @click="checkCarDealer(row)">{{row.drawerPartyName}}</a>
                            </template>

                           <!-- <template slot-scope="{ row, index }" slot="cardealerRegistAddress" >
                                <span>{{row.cardealerRegistProvince}}{{row.cardealerRegistCity}}</span>
                            </template-->>

                            <template slot-scope="{ row, index }" slot="cardealerRegistAddress">
                                <span>{{getDetailAddress(row.cardealerRegistProvince,row.cardealerRegistCity,row.cardealerRegistAddr)}}</span>
                            </template>

                            <template slot-scope="{ row, index }" slot="registCity">
                                <span>{{getDetailAddress1(row.registProvince,row.registCity)}}</span>
                            </template>


                            <template slot-scope="{ row, index }" slot="status" >
                                <div v-if="row.status == '00'">
                                    <Tag color="success" size="default">启用</Tag>
                                </div>
                                <div v-if="row.status == '05'">
                                    <Tag color="error" size="default">停用</Tag>
                                </div>
                                <div v-if="row.status == '02'">
                                    <Tag color="default" size="default">草稿</Tag>
                                </div>
                            </template>

                            <template slot-scope="{ row }" slot="action">
                                <span >
                                    <Button  style="margin-right:5px" type="primary" size="small" @click="edit(row)" v-bind:disabled="!directManageRole && !commonManageRole">编辑</Button>
                                </span>
                            </template>

                        </Table>
                    </Row>
                    <Row type="flex" justify="end" class="page">
                        <Page :current="searchForm.pageNumber" :total="total" :page-size="searchForm.pageSize"
                              @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50]"
                              size="small" show-total show-elevator show-sizer></Page>
                    </Row>
                </Card>
            </Col>
        </Row>
    </div>
</template>

<script>
    import {
        getDrawerPartyData,
        disableDrawerParty,
        getCarDealerByChannelId,
        deleteDrawerParty,
    } from "@/projects/afs-channel/api/drawer-party/drawerParty";
    import circleLoading from "_c/circle-loading/circle-loading.vue";
    import { getLocation } from "@/projects/afs-channel/api/common/common";
    import {province, city, area} from "_p/afs-apply/assets/js/staticData.js";
    import Utils from '../../api/drawer-party/drawerParty.js';

    export default {
        name: "drawer-party",
        components: {
            circleLoading
        },
        data() {

            return {
                //权限
                directManageRole:false,
                directcheckRole:false,
                commonManageRole:false,
                commoncheckRole:false,

                province:[],
                city:[],
                drop: false,
                dropDownIcon: "ios-arrow-down",
                dropDownContent: "展开",
                loading: false,
                operationLoading: false,
                selectCount: 0,
                selectList: [],
                viewImage: false,
                deptId: [],
                selectDep: [],
                department: [],
                searchKey: "",
                searchForm: {
                    //*******暂时合作商的id写死, 后期要改*****
                    //channelId:"123",
                    channelBelong:null,

                    drawerPartyName: "",
                    taxpayerIdNumber: "",
                    status: "",
                    cardealerId: "",
                    channelFullName: "",
                    pageNumber: 1,
                    pageSize: 10,
                    startDate: "",
                    endDate: ""
                },
                selectDate: null,
                userModalVisible: false,
                submitLoading: false,
                columns: [
                    {
                        type: "selection",
                        minWidth: 60,
                        maxWidth:60,
                        align: "center",
                        fixed: "left"
                    },
                    {
                        type: 'index',
                        title:"序号",
                        minWidth: 80,
                        align: "center",
                        fixed: "left"

                    },
                    {
                        title: "开票方名称",
                        key: "drawerPartyName",
                        slot: "drawerPartyName",
                        minWidth: 200,
                        align: "center",
                        fixed: "left"
                    },
                    {
                        title: "SP名称",
                        key: "channelFullName",
                        minWidth: 200,
                        align: "center",
                        //fixed: "left",
                        //ellipsis: true,
                        //tooltip: true
                    },
                    {
                        title: "车商名称",
                        minWidth: 200,
                        key: "cardealerName",
                        align: "center",
                    },
                    {
                        title: "车商注册地",
                        slot: "cardealerRegistAddress",
                        minWidth: 250,
                        align: "center",
                        //sortable: true
                    },
                    {
                        title: "状态",
                        slot: "status",
                        minWidth: 100,
                        align: "center",
                    },
                    {
                        title: "开票方注册省市",
                        slot: "registCity",
                        minWidth: 160,
                        align: "center",
                    },

                    {
                        title: "开票方注册时间",
                        key: "registDate",
                        minWidth: 140,
                        align: "center",
                        //sortable: true

                    },
                    {
                        title: "纳税人识别号",
                        key: "taxpayerIdNumber",
                        minWidth: 180,
                        align: "center",
                        //sortable: true,
                    },
                    {
                        title: "地址",
                        key: "address",
                        minWidth: 180,
                        align: "center",
                        ellipsis:true,
                        render: (h, params) => {
                            return h('div', [
                                h('span', {
                                    style: {
                                        display: 'inline-block',
                                        width: '100%',
                                        overflow: 'hidden',
                                        textOverflow: 'ellipsis',
                                        whiteSpace: 'nowrap'
                                    },
                                    domProps: {
                                        title: params.row.address
                                    }
                                }, params.row.address)
                            ])
                        }
                        //sortable: true,

                    },
                    {
                        title: "备注",
                        key: "remark",
                        minWidth: 160,
                        align: "center",
                        ellipsis:true,
                        render: (h, params) => {
                            return h('div', [
                                h('span', {
                                    style: {
                                        display: 'inline-block',
                                        width: '100%',
                                        overflow: 'hidden',
                                        textOverflow: 'ellipsis',
                                        whiteSpace: 'nowrap'
                                    },
                                    domProps: {
                                        title: params.row.remark
                                    }
                                }, params.row.remark)
                            ])
                        }
                        //sortable: true,
                    },
                    {
                        title: "操作",
                        key: "action",
                        minWidth: 100,
                        align: "center",
                        fixed: "right",
                        slot: "action"
                    }

                ],
                data: [],
                data2: [],
                total: 0
            };
        },
        methods: {
            init() {
                this.getUserRole();
                this.handleSearch();
              //  this.getCarDealerById();
                this.getProvinceData();
                this.getCityData();
            },

            getUserRole(){
                let userRoles = this.$store.state.user.roles.toString()
                console.log(userRoles)
                //直营管理
                if (userRoles.indexOf('ROLE_OWN_MANAGE_INVOICE') > -1 || userRoles.indexOf('ROLE_ADMIN')> -1 || userRoles.indexOf('ROLE_CHANNEL_ADMIN')> -1) {
                    this.directManageRole = true;
                    this.directcheckRole = true;
                }
                //直营查看
                if (userRoles.indexOf('ROLE_OWN_SEE_INVOICE') > -1 || userRoles.indexOf('ROLE_ADMIN')> -1 || userRoles.indexOf('ROLE_CHANNEL_ADMIN')> -1) {
                    this.directcheckRole = true;
                }
                //非直营管理
                if (userRoles.indexOf('ROLE_OTHER_MANAGE_INVOICE') > -1 || userRoles.indexOf('ROLE_ADMIN')> -1 || userRoles.indexOf('ROLE_CHANNEL_ADMIN')> -1) {
                    this.commonManageRole = true;
                    this.commoncheckRole = true;
                }
                //非直营查看
                if (userRoles.indexOf('ROLE_OTHER_SEE_INVOICE') > -1 || userRoles.indexOf('ROLE_ADMIN')> -1 || userRoles.indexOf('ROLE_CHANNEL_ADMIN')> -1) {
                    this.commoncheckRole = true;
                }
            },

            changePage(v) {
                this.searchForm.pageNumber = v;
                this.getDrawerPartyList();
                this.clearSelectAll();
            },
            changePageSize(v) {
                this.searchForm.pageSize = v;
                this.getDrawerPartyList();
            },
            getDrawerPartyList() {
                // 多条件搜索开票方列表
                if(this.commoncheckRole && !this.directcheckRole){
                    this.searchForm.channelBelong = ['00','02']
                }else if(!this.commoncheckRole && this.directcheckRole){
                    this.searchForm.channelBelong = ['01']
                }
                console.log(this.commoncheckRole,"非直营")
                console.log(this.directcheckRole,"直营")

                let param={
                    channelBelong:this.searchForm.channelBelong,
                    drawerPartyName: this.searchForm.drawerPartyName.replace(/\s*/g,""),
                    taxpayerIdNumber: this.searchForm.taxpayerIdNumber.replace(/\s*/g,""),
                    status: this.searchForm.status,
                    cardealerId: this.searchForm.cardealerId,
                    channelFullName: this.searchForm.channelFullName.replace(/\s*/g,""),
                    pageNumber: this.searchForm.pageNumber,
                    pageSize: this.searchForm.pageSize,
                }

                this.loading = true;
                getDrawerPartyData(param).then(res => {
                    this.loading = false;
                    if (res.code === "0000") {
                        this.data = res.data.records;
                        this.data2 = res.data.records;
                        this.total = res.data.total;
                        console.log(this.data)
                    }
                });
            },

            //根据合作商id查询相关的信息
          /*  getChannelInfoById(){
                let id = this.searchForm.channelId;
                getChannelBasicInfoById(id).then(res => {
                    if (res.code === "0000") {
                        this.searchForm.channelBelong=res.data[0].channelBelong;
                    }
                });
            },*/

            getCarDealerById(){
                //合作商的id  目前写死 后期要改
                getCarDealerByChannelId(this.searchForm.channelId).then(res => {
                    this.loading = false;
                    if (res.code === "0000") {
                        this.data2 = res.data;
                        console.log(this.data2)
                    }
                });
            },

            handleSearch() {
                this.searchForm.pageNumber = 1;
                this.getDrawerPartyList();
            },

            handleReset() {
                this.$refs.searchForm.resetFields();
                this.selectDate = null;
                this.searchForm.startDate = "";
                this.searchForm.endDate = "";
                this.selectDep = [];
                this.searchForm.deptId = "";
            },
            changeSort(e) {
                this.searchForm.sort = e.key;
                this.searchForm.order = e.order;
                if (e.order === "normal") {
                    this.searchForm.order = "";
                }
                this.getDrawerPartyList();
            },
            showSelect(e) {
                this.selectList = e;
                this.selectCount = e.length;
            },


            addDrawerParty() {
                let params = {
                    type: "1"
                };
                this.afs.newTab(
                    this,
                    'projects/afs-channel/pages/drawer-party/drawerPartyEdit',
                    '开票方新增',
                    'ios-add',
                    params,
                    'drawer-party-add',
                    [],
                    true);
                //this.afs.newTab(this,'projects/afs-channel/pages/drawer-party/drawerPartyEdit','开票方新增','ios-add',params,'aa',[],true);
            },

            checkCarDealer(v) {
                let params = {
                    type:"0",
                    drawerPartyId:v.id,
                    channelId:v.channelId,
                    cardealerId:v.cardealerId,
                };
                this.afs.newTab(
                    this,
                    'projects/afs-channel/pages/drawer-party/drawerPartyEdit',
                    '开票方'+v.drawerPartyName+"查看",
                    'ios-add',
                    params,
                    'drawer-party-check'+v.id,
                    [],
                    true);
              //  this.afs.newTab(this,'projects/afs-channel/pages/drawer-party/drawerPartyEdit','开票方查看','ios-add',params,'aa',[],true);
            },

            edit(v) {
                let params = {
                    type:"2",
                    drawerPartyId:v.id,
                    channelId:v.channelId,
                    cardealerId:v.cardealerId,
                    /*channelFullName:v.channelFullName,
                    cardealerName:v.cardealerName,*/
                };
                this.afs.newTab(
                    this,
                    'projects/afs-channel/pages/drawer-party/drawerPartyEdit',
                    '开票方'+v.drawerPartyName+"修改",
                    'ios-add',
                    params,
                    'drawer-party-edit'+v.id,
                    [],
                    true);
               // this.afs.newTab(this,'projects/afs-channel/pages/drawer-party/drawerPartyEdit','开票方修改','ios-add',params,'aa',[],true);
            },

            //停用开票方
            disable() {
                if (this.selectCount <= 0) {
                    this.$Message.warning("您还未选择要停用的开票方");
                    return;
                }
                let status = false;
                this.selectList.forEach(function (e) {
                    if(e.status != '00'){
                        status = true;
                    }
                });
                if(status){
                    this.$Message.warning("只能停用已启用的开票方");
                    return;
                }
                this.$Modal.confirm({
                    title: "确认停用",
                    content: "您确认要停用所选的 " + this.selectCount + " 条数据?",
                    onOk: () => {
                        let ids = [];
                        this.selectList.forEach(function (e) {
                            ids += e.id + ",";
                        });
                        ids = ids.substring(0, ids.length - 1);
                        this.operationLoading = true;
                        //禁用方法
                        disableDrawerParty(ids).then(res => {
                            this.operationLoading = false;
                            if (res.code === "0000") {
                                this.$Message.success("停用成功");
                                //    this.clearSelectAll();
                                this.getDrawerPartyList();
                            }
                        });
                    }
                });
            },

            remove(v) {
                this.$Modal.confirm({
                    title: "确认删除",
                    content: "您确认要删除开票方 " + v.drawerPartyName + " ?",
                    onOk: () => {
                        this.operationLoading = true;
                        deleteDrawerParty(v.id).then(res => {
                            this.operationLoading = false;
                            if (res.code === "0000") {
                                this.$Message.success("删除成功");
                                this.handleSearch();
                            }
                        });
                    }
                });
            },

            dropDown() {
                if (this.drop) {
                    this.dropDownContent = "展开";
                    this.dropDownIcon = "ios-arrow-down";
                } else {
                    this.dropDownContent = "收起";
                    this.dropDownIcon = "ios-arrow-up";
                }
                this.drop = !this.drop;
            },

            //反向解析省市地址
            getProvinceData() {
                let param = {level:"1",upperCode: "1"};

                getLocation(param).then(res => {
                    if(res.code === "0000"){
                        this.province=res.data;
                    }
                });
            },
            getCityData() {
                let param = {level:2,upperCode:''};
                getLocation(param).then(res => {
                    if (res.code == "0000") {
                        this.city=res.data;
                    }
                });
            },

            getDetailAddress(registeredProvince,registeredCity,registeredAddress){
                if(registeredProvince!="" && registeredCity!="" && registeredAddress !=""){
                    let province="";
                    let city="";
                    for(let i=0;i<this.province.length;i++){
                        if(this.province[i].value==registeredProvince){
                            province=this.province[i].label;
                        }
                    };
                    for(let i=0;i<this.city.length;i++){
                        if(this.city[i].value==registeredCity){
                            city=this.city[i].label;
                        }
                    };
                    return province+city+registeredAddress;
                }else{
                    return '';
                }
            },

            getDetailAddress1(registeredProvince,registeredCity){
                if(registeredProvince!="" && registeredCity!=""){
                    let province="";
                    let city="";
                    for(let i=0;i<this.province.length;i++){
                        if(this.province[i].value==registeredProvince){
                            province=this.province[i].label;
                        }
                    };
                    for(let i=0;i<this.city.length;i++){
                        if(this.city[i].value==registeredCity){
                            city=this.city[i].label;
                        }
                    };
                    return province+city;
                }else{
                    return '';
                }
            },

        },

        mounted() {
            this.init();
            var that = this;
        },
        watch: {
            '$route'(to,from){
                this.handleReset();
                this.handleSearch();
            }
        },

    };
</script>
